জাভাস্ক্রিপ্ট কি?
জাভাস্ক্রিপ্ট(Javascript) হচ্ছে ওয়েব এবং এইচটিএমএল-এর জন্য প্রোগ্রামিং ভাষা।
প্রোগ্রামিংয়ের সাহায্যে আপনি কম্পিউটারকে দিয়ে যা করাতে চান তাই করাতে পারবেন।
জাভাস্ক্রিপ্ট শেখাও অনেক সহজ।
আমাদের এই জাভাস্ক্রিপ্ট টিউটোরিয়ালটি আপনাকে জাভাস্ক্রিপ্টের মৌলিক ধারণা থেকে অ্যাডভান্স লেভেলের প্রোগ্রামার হতে সাহায্য করবে।
আমাদের প্রতিটি পরিচ্ছেদে আছে অসংখ্য উদাহরণ সেকশন। আপনি উদাহরণ সেকশনে মাউস নিয়ে গেলে উপরের কোণায় কোড copy করার একটি অপশন দেখতে পাবেন। copy অপশনে মাউস ক্লিক করলে ক্লিপবোর্ডে কোড কপি হবে।
আপনি আপনার এডিটর ওপেন করে copy করা কোড paste করতে পারবেন। এছাড়া উদাহরণ সেকশনের নিচে উদাহরণের ফলাফলও দেখানো হয়েছে।
kt_satt_skill_example_id=10
জাভাস্ক্রিপ্ট কেন শিখবেন?
ওয়েব ডেভেলপমেন্ট এর জন্য তিনটি প্রোগ্রামিং ল্যাংগুয়েজ ব্যবহৃত হয়।
জাভাস্ক্রিপ্ট এই ৩টি ল্যাংগুয়েজের মধ্যে অন্যতম যা প্রত্যেক ওয়েব ডেভেলপারের জন্যই জানা আবশ্যকঃ
১. এইচটিএমএল ওয়েব পেজের কন্টেন্ট সরবরাহ করে।
২. সিএসএস ওয়েব পেজের নকশা তৈরি করে।
৩. জাভাস্ক্রিপ্ট ওয়েব পেজের কাজের ধারা/আচরণ ঠিক করে।
এই টিউটোরিয়ালে জাভাস্ক্রিপ্ট এবং জাভাস্ক্রিপ্ট কিভাবে এইচটিএমএল এবং সিএসএসের সাথে কাজ করে সে সম্বন্ধে আলোচনা করা হয়েছে।
জাভাস্ক্রিপ্ট সারা বিশ্বের মধ্যে সবচেয়ে জনপ্রিয় প্রোগ্রামিং ভাষা।
চলুন উদাহরণের সাহায্যে জাভাস্ক্রিপ্টের কিছু ব্যবহার দেখি।
জাভাস্ক্রিপ্ট এইচটিএমএল কন্টেন্ট পরিবর্তন করতে পারে
জাভাস্ক্রিপ্টে বহুবিধ মেথড রয়েছে তন্মধ্যে getElementById() মেথডটি অন্যতম।
এই উদাহরনে getElementById() মেথডটি id="test" যুক্ত এইচটিএমএল এলিমেন্টকে খুঁজে বের করার জন্য ব্যবহার করা হয়েছে এবং এলিমেন্টের কন্টেন্ট "হ্যালো জাভাস্ক্রিপ্ট" দ্বারা পরিবর্তন করা হয়েছে।
জাভাস্ক্রিপ্ট এইচটিএমএল এট্রিবিউট পরিবর্তন করতে পারে
এই উদাহরণটিতে ট্যাগের type এট্রিবিউট পরিবর্তন করা হয়েছেঃ
জাভাস্ক্রিপ্ট এইচটিএমএল স্টাইল পরিবর্তন করতে পারে
এইচটিএমএল এলিমেন্টের এট্রিবিউট পরিবর্তন করা থেকে এইচটিএমএল স্টাইল পরিবর্তন করা একটু ভিন্নঃ
জাভাস্ক্রিপ্ট কোথায় রাখবেন?
এইচটিএমএল পেজের মধ্যে অথবা অথবা উভয় ট্যাগ এর মধ্যে জাভাস্ক্রিপ্টকে রাখা যায়।
ট্যাগের মধ্যে লিখতে হবে।
জাভাস্ক্রিপ্ট এর পুরাতন ভার্সন সমূহে type এট্রিবিউট ব্যবহার করা হত। যেমনঃ <script type="text/javascript">।
কিন্তু বর্তমানে আর এটার প্রয়োজন নাই। কারণ জাভাস্ক্রিপ্ট এইচটিএমএলের পূর্বনির্ধারিত স্ক্রিপ্টিং ল্যাংগুয়েজ।
জাভাস্ক্রিপ্ট ফাংশন এবং ইভেন্ট
জাভাস্ক্রিপ্ট ফাংশন হচ্ছে একগুচ্ছ জাভাস্ক্রিপ্ট কোড যাকে আপনি "কল" করলে সম্পাদিত হবে।
উদাহরণস্বরূপঃ কোন ইভেন্ট(ঘটনা) ঘটলেই একটি ফাংশন সম্পাদিত হবে। যেমনঃ ব্যবহারকারী যদি মাউস ক্লিক করে।
পরবর্তীতে ফাংশন এবং ইভেন্ট সম্পর্কে বিস্তারিত আলোচনা করা হয়েছে।
অথবা এর মধ্যে জাভাস্ক্রিপ্ট
এইচটিএমএল ডকুমেন্টের মধ্যে আপনি যত খুশি জাভাস্ক্রিপ্ট কোড লিখতে/রাখতে পারবেন।
জাভাস্ক্রিপ্টকে এইচটিএমএলের অথবা অথবা উভয়ের মধ্যেই রাখা যেতে পারে।
 | সবচেয়ে ভাল অভ্যাস হচ্ছে সকল কোড একই স্থানে রাখা। |
|---|
এলিমেন্টে জাভাস্ক্রিপ্ট
এই উদাহরণে জাভাস্ক্রিপ্ট ফাংশনকে এইচটিএমএল পেজের অংশে রাখা হয়েছে।
বাটনে ক্লিক করলে ফাংশনটি আপনার ডাকে সাড়া দিবেঃ
এর মধ্যে জাভাস্ক্রিপ্ট
এই উদাহরণে জাভাস্ক্রিপ্ট ফাংশনকে এইচটিএমএল পেজের এলিমেন্টে রাখা হয়েছে
বাটনে ক্লিক করলে ফাংশনটি আপনার ডাকে সাড়া দিবেঃ
| জাভাস্ক্রিপ্টকে এতে আপনার পেজ দ্রুত লোড হয়। কারণ জাভাস্ক্রিপ্ট কম্পাইলার আপনার পেজকে ধীরগতি সম্পন্ন করে দিতে পারে। |
|---|
বাহ্যিক জাভাস্ক্রিপ্ট
জাভাস্ক্রিপ্টকে বাহ্যিক(external) ফাইলের মধ্যেও রাখা যায়ঃ
একই ধরণের স্ক্রিপ্ট কোড যখন একাধিক ওয়েব পেজে ব্যবহার করার প্রয়োজন হয় তখন এক্সটার্নাল জাভাস্ক্রিপ্ট ব্যবহার করতে হয়।
জাভাস্ক্রিপ্ট ফাইলের ফাইল এক্সটেনশন হচ্ছে .js।
এক্সটার্নাল জাভাস্ক্রিপ্ট ব্যবহার করার জন্য জাভাস্ক্রিপ্ট ফাইলটি